import React, { Component } from "react";
import { Tree, Form, Input } from "antd";

import PropTypes from "prop-types";
import menuList from '../../config/menuConfig'
const Item = Form.Item;
const { TreeNode } = Tree;
export default class UpadteForm extends Component {
  static propTypes = {
    role: PropTypes.object,
  }; 
  constructor (props) { 
    super( props )
    console.log(this.props);
    const { menus} = this.props.role
    this.state = {
      checkedKeys:menus
    }
  }
  onCheck = checkedKeys => { 
    this.setState( {checkedKeys})
  }
  getMenus = () => this.state.checkedKeys
  

  componentWillReceiveProps ( nextProps ) { 
    const menus = nextProps.role.menus
    this.setState( {
      checkedKeys:menus
    })
  }
  render() {
    const { role } = this.props;
    const { checkedKeys}=this.state
    const formItemLayout = {
      labelCol: { span: 4 },
      wrapperCol: { span: 15 },
    };
    return (
      <Form>
        <Item label="角色名称" name='auth'>
          <Input value={role.name} disabled />
        </Item>
        <Tree
          checkable
          defaultExpandAll='true'
          // onExpand={onExpand}
          // expandedKeys={expandedKeys}
          // autoExpandParent={autoExpandParent}
          onCheck={this.onCheck}
          checkedKeys={checkedKeys}
          // onSelect={onSelect}
          // selectedKeys={selectedKeys}
          treeData={menuList}
        >

        </Tree>
      </Form>
    );
  }
}
